<!--
  @author yangjiangming
  @date 2018-12-10 20:40:28
-->
<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html th:replace="~{work/modify/common/layout :: layout('派单', ~{::title}, ~{::content}, ~{::script})}"
      xmlns:th="http://www.w3.org/1999/html">
<head>
    <title>工单管理-派单</title>
</head>
<body>

<div class="layui-row" style="margin-bottom: 20px; height: 30px;" th:fragment="buttonList">
<!--    <button class="layui-btn layui-btn-sm"-->
<!--            th:text="${distributeVO.mainSkillName}"-->
<!--            data-th-data-id="${distributeVO.mainSkillId}"></button>-->
<!--    <button class="layui-btn layui-btn-sm layui-btn-primary">全部</button>-->
</div>

<div th:fragment="content">
    <script type="text/javascript" th:src="|//api.map.baidu.com/api?v=2.0&ak=${#baiduAkUtil.getWebAk()}|"></script>
    <script type="text/javascript" src="//api.map.baidu.com/library/GeoUtils/1.2/src/GeoUtils_min.js"></script>
    <link rel="stylesheet" href="/static/style/work/modify/distribute.css">
</div>

<div class="page-work-modify-distribute" th:fragment="content">
    <form class="layui-form" method="post" action="/work/modify/save/distribute.action" lay-filter="zmn-work-form">
        <input type="hidden" id="casSign" name="casSign" th:value="${casSign}"/>
        <input type="hidden" id="orderId" name="orderId" th:value="${orderId}"/>
        <input type="hidden" id="workId" name="workId" th:value="${workId}"/>
        <input type="hidden" id="companyId" th:value="${companyId}"/>
        <input type="hidden" id="manageCompanyId" th:value="${manageCompanyId}"/>

        <th:block th:if="${!distributeVO.allowDistributeOrder}">
            <div class="layui-form-item">
                <label class="layui-form-label"></label>
                <p class="message-danger">请先处理完进行中的跟单再派单</p>
            </div>
        </th:block>
        <div class="layui-form-item">
            <label class="layui-form-label">工程师：</label>
            <th:block th:if="${distributeVO.simpleStatus}">
                <div class="layui-input-inline">
                    <select id="masterSelect" name="masterId" lay-filter="masterSelect" lay-search>
                        <option value="">请选择</option>
                        <option
                                th:each="item : ${distributeVO.masterList}"
                                th:selected="${item.masterId == distributeVO.masterId}"
                                th:value="${item.masterId}"
                                th:text="${item.masterName} + '-' + ${item.masterPhone}">
                        </option>
                    </select>
                </div>
            </th:block>

            <th:block th:if="${distributeVO.recommendStatus and !distributeVO.simpleStatus}">
            <div class="layui-input-inline">
                    <input type="hidden" name="masterId">
                    <input class="layui-input" type="text" id="masterId" value="" placeholder="请在下方双击选择工程师" readonly autocomplete="off">
                </div>
            </th:block>

            <div class="layui-input-inline distribute-btn-wrapper">
                <div class="layui-btn-container">
                    <!-- 网络电话 -->
                    <th:block th:if="${#authPermit.checkPermit('/oms/netcall/im/connect.action')}">
                        <div class="layui-btn zmn-btn-voice" id="btn-call" lay-submit lay-filter="call" th:disabled="${distributeVO.masterId == null}"  th:classappend="${distributeVO.masterId == null}? 'layui-btn-disabled'">
                            <i class="zmn-icon zmn-icon-voice"></i>
                        </div>
                    </th:block>
                    <!-- 呼叫电话 -->
                    <th:block th:if="${#authPermit.checkPermit('/work/detail/call.action')}">
                        <div class="layui-hide layui-btn zmn-btn-voice" id="btn-cc-call" lay-submit lay-filter="cc-call" th:disabled="${distributeVO.masterId == null}"  th:classappend="${distributeVO.masterId == null}? 'layui-btn-disabled'">
                            <i class="zmn-icon zmn-icon-phone1"></i>
                        </div>
                    </th:block>

                    <th:block th:if="${distributeVO.allowDistributeOrder}">
                        <input class="layui-btn btn-distribute" id="distribute" type="button" value="确认派单" lay-filter="distribute" lay-submit></input>
                    </th:block>
                    <th:block th:unless="${distributeVO.allowDistributeOrder}">
                        <input class="layui-btn btn-distribute layui-btn-disabled" disabled id="distribute" type="button" value="确认派单" lay-filter="distribute" lay-submit></input>
                    </th:block>
                </div>
            </div>
            <div class="layui-form-mid layui-word-aux" style="margin-left: -135px;">
            <p class="message-danger" th:if="${distributeVO.dutyRecentMaster != null}">
                    相似工单，已派给工程师：[[${distributeVO.dutyRecentMaster.masterName}]]-[[${distributeVO.dutyRecentMaster.masterPhone}]]</p>
            </div>
        </div>
        <div class="layui-collapse">
            <div class="layui-colla-item">
                <div class="layui-colla-content">
                    <div class="layui-form-item">
                        <label class="layui-form-label">工程师：</label>
                        <div class="layui-input-inline">
                            <select id="select-master" style="width: 100%;" lay-ignore>
                            </select>
                        </div>
                        <div class="layui-input-inline distribute-btn-wrapper">
                            <div class="layui-btn-container">
                                <th:block th:if="${#authPermit.checkPermit('/oms/netcall/im/connect.action')}">
                                    <div class="layui-btn zmn-btn-voice btn-placeholder" lay-filter="call" lay-submit >
                                        <i class="zmn-icon zmn-icon-voice"></i>
                                    </div>
                                </th:block>
                                <input class="layui-btn btn-distribute" id="check-master" type="button" lay-filter="check-master" lay-submit value="校验"></input>
                            </div>
                        </div>
                        <div class="layui-form-mid">
                            <p class="master-check-message">
                                <span id="master-check-msg"></span>
                            </p>
                        </div>
                    </div>
                </div>
                <h2 class="layui-colla-title">校验工程师</h2>
            </div>
        </div>
    </form>
    <th:block th:unless="${isRework}">
        <div th:if="${ distributeVO.recommendStatus }">
            <div class="layui-tab layui-tab-brief tab-distribute" lay-filter="docDemoTabBrief">
                <ul class="layui-tab-title">
                    <li class="layui-this">
                        <button class="layui-btn layui-btn-sm btn-active" type="button">地图</button>
                        <button class="layui-btn layui-btn-primary layui-btn-sm" type="button">地图</button>
                    </li>
                    <li>
                        <button class="layui-btn layui-btn-sm btn-active" type="button">列表</button>
                        <button class="layui-btn layui-btn-primary layui-btn-sm" type="button">列表</button>
                    </li>
                </ul>
                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show" id="mapView">
                        <div th:replace="this :: buttonList"></div>
                        <div>
                            <div class="layui-row layui-col-space15">
                                <div class="layui-col-md9">
                                    <div class="map" id="mapOfmaterList"></div>
                                </div>
                                <div class="layui-col-md3">
                                    <table id="simpleMasterTable" lay-filter="tableOfMatserList"></table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-tab-item" id="tableView">
                        <div th:replace="this :: buttonList"></div>
                        <table id="detailMasterTable" lay-filter="tableOfMatserList"></table>
                    </div>
                </div>
            </div>
        </div>
    </th:block>

    <div th:if="${isRework}" id="tableView">
        <table id="detailMasterTable" lay-filter="tableOfMatserList"></table>
    </div>

    <div class="layui-hide" id="modal-voice-wrapper">
        <div class="modal-main">
            <div class="modal-content">
                <p>目前系统支持和工程师app的语音通话的手机品牌有：华为、小米、vivo、oppo、魅族，其他手机品牌系统暂不支持</p>
            </div>
            <div class="modal-footer">
                <form class="layui-form">
                    <div class="layui-form-item">
                        <div class="btn-container">
                            <input class="layui-btn" type="button" lay-filter="form-modal" lay-submit value="我知道了"></input>
                            <div class="input-noTips">
                                <input type="checkbox" name="noTips" lay-skin="primary" title="下次不再提醒">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <div class="layui-hide" id="modal-distribute-wrapper">
        <div class="modal-main">
            <div class="modal-content">
                <p>
                    已有工程师领单，确认重新派单？<br>
                    重新派单后，工单状态将变更至：已派单状态，并且清空：服务项目、人工优惠等信息。
                </p>
            </div>
            <div class="modal-footer">
                <div class="btn-container">
                    <button class="layui-btn" id="btn-confirm">确认</button>
                    <input type="button" class="layui-btn layui-btn-primary" id="btn-cancel" value="取消"></input>
                </div>
            </div>
        </div>
    </div>
</div>

<script th:inline="javascript">
    var json = {
        dutyInfo: [[${distributeVO.dutyInfo}]],
        masterId: [[${distributeVO.masterId}]],
        masterList: [[${distributeVO.masterList}]],
        recommendMasterList: [[${distributeVO.recommendMasterList}]],
        nonDistributeMasterList: [[${distributeVO.nonDistributeMasterList}]],
        mainSkillId: [[${distributeVO.mainSkillId}]],
        orderLocation: {
            lng: [[${distributeVO.longitude}]],
            lat: [[${distributeVO.latitude}]]
        },
        isRework: [[${isRework}]],
        plat: [[${plat}]],
        // 推荐状态
        recommendStatus: [[${distributeVO.recommendStatus}]],
        // 简单状态
        simpleStatus: [[${distributeVO.simpleStatus}]],
        // 公平状态
        fairStatus: [[${distributeVO.fairStatus}]],
        reworkMasterId: [[${distributeVO.reworkMasterId}]],
        weightMap: [[${distributeVO.weightMap}]],
    };
    var canNetCall = [[${#authPermit.checkPermit('/oms/netcall/im/connect.action')}]];

    var layuiModel = {
        oms_work_modify_distribute: "work/modify/zmn.oms.work.modify.distribute"
    };
</script>
</body>
</html>